import React from 'react';
import s from './style.module.css';
import PropTypes from 'prop-types';

function ForeignLinks({ info }) {
  const content = () => {
    return Object.entries(info).map(([type, detail]) => {
      switch (type) {
        case 'keyword':
          return (
            <div>
              <div className={s.title}>违规内容：</div>
              <div className={s.box}>
                {detail.map((e, i) => {
                  const str = i === detail.length - 1 ? e.risk_rule : e.risk_rule + '、';
                  return str;
                })}
              </div>
            </div>
          );
        case 'icp':
          return (
            <div>
              <div className={s.title}>未备案：</div>
              <div className={s.box}>
                {detail.map((e, i) => {
                  const str = `域名${e.risk_domain}未备案，可能为不合规网站，请及时处理。`;
                  return <p key={i}>{str}</p>;
                })}
              </div>
            </div>
          );
        case 'domain':
          return (
            <div>
              <div className={s.title}>风险域名：</div>
              <div className={s.box}>
                {detail.map((e, i) => {
                  return <p key={i}>{e.extra_details?.zh_cn}</p>;
                })}
              </div>
            </div>
          );
        case 'black_links':
          return (
            <div>
              <div className={s.title}>暗链：</div>
              <div className={s.tableBox}>
                <table className={s.table}>
                  <thead className={s.thead}>
                    <tr className={s.head}>
                      <td>恶意链接</td>
                    </tr>
                  </thead>
                  <tbody className={s.tbody}>
                    {detail.map((e, i) => {
                      return e.links.map((item, i) => {
                        return (
                          <tr className={s.row} key={i}>
                            <td>{item}</td>
                          </tr>
                        );
                      });
                    })}
                  </tbody>
                </table>
              </div>
            </div>
          );
        case 'cryjack':
          return (
            <div>
              <div className={s.title}>挖矿：</div>
              <div className={s.tableBox}>
                <table className={s.table}>
                  <thead className={s.thead}>
                    <tr className={s.head}>
                      <td>关键词</td>
                      <td>资源链接</td>
                    </tr>
                  </thead>
                  <tbody className={s.tbody}>
                    {detail.map((e) => {
                      return e.results.map((item, i) => {
                        return (
                          <tr className={s.row} key={i}>
                            <td>{item.pattern}</td>
                            <td>{item.src}</td>
                          </tr>
                        );
                      });
                    })}
                  </tbody>
                </table>
              </div>
            </div>
          );
        default:
          return (
            <div>
              <div className={s.title}>挂马：</div>
              <div className={s.tableBox}>
                <table className={s.table}>
                  <thead className={s.thead}>
                    <tr className={s.head}>
                      <td>特征描述</td>
                      <td>类型</td>
                      <td>辅助信息</td>
                    </tr>
                  </thead>
                  <tbody className={s.tbody}>
                    <tr className={s.row}>
                      <td>--</td>
                      <td>--</td>
                      <td>--</td>
                    </tr>
                  </tbody>
                </table>
              </div>
            </div>
          );
      }
    });
  };
  React.useEffect(() => {}, [info]);
  return <div className={s.panelBox}>{content()}</div>;
}
ForeignLinks.propTypes = {
	info: PropTypes.any,
};
ForeignLinks.defaultProps = {
	info: {},
};
export default ForeignLinks;
